<import file="block/common.html" name="url"/>
<div class="layui-fluid">
	<div class="layui-row layui-col-space15">
		<div class="layui-col-md12">
			<div class="layui-btn-container">
				<?php echo sysrolTF("contentcate_add")?'<button class="layui-btn layui-btn-sm data-add-btn"> '.lang('add').' </button>':''; ?>
				<button id="btnExpandAll" class="layui-btn layui-btn-sm"> 全部展开 </button>
				<button id="btnFoldAll" class="layui-btn layui-btn-sm"> 全部折叠 </button>
			</div>

			<table class="layui-hide" id="currentTableId" lay-data="{id: 'idReload'}" lay-filter="currentTableFilter"></table>

			<script type="text/html" id="currentTableBar">
			<?php echo sysrolTF("contentcate_edit")?'<a class="layui-btn layui-btn-xs data-count-edit" lay-event="edit">'.lang('edit').'</a>':''; ?>
			<?php echo sysrolTF("contentcate_del")?'<a class="layui-btn layui-btn-xs layui-btn-danger data-count-delete" lay-event="delete">删除</a>':'<a class="layui-btn layui-btn-xs layui-btn-disabled">删除</a>'; ?>
			</script>
			<script type="text/html" id="catetypeTableBar">
				{{#  if(d.type == 1){ }}
					列表
				{{#  }else{ }}
					<b style="color:red">频道</b>
				{{#  } }}
			</script>
			<script type="text/html" id="ctcount">
				{{#  if(d.ct == 0){ }}
					不统计
				{{#  }else{ }}
					<b style="color:red">统计</b>
				{{#  } }}
			</script>
			<script type="text/html" id="themeTableBar">
				{{#  if(d.theme == null){ }}
					默认(index.html)
				{{#  }else{ }}
					{{ d.theme }}
				{{#  } }}
			</script>
			<script type="text/html" id="themeColor">
				{{#  if(d.color.length < 1){ }}
					<span class="layui-badge-rim"><i class="layui-icon">&#xe658;</i></span>
				{{#  }else{ }}
					<span class="layui-badge-rim"><i class="layui-icon" style="color:{{ d.color }};">&#xe658;</i></span>
				{{#  } }}
			</script>
		</div>
	</div>

</div>

<script>
	layui.use(['treeTable', 'table'], function () {
		$ = layui.jquery,
			table = layui.table,
			form = layui.form;
		var treeTable = layui.treeTable;

		var insTb = treeTable.render({
			elem: '#currentTableId',
			text: {
				none: '<div style="padding: 18px 0;">无数据</div>'
			},
			url: '<{caUrl("contentcate","index")}>&list_json',
			tree: {
				iconIndex: 1,  // 折叠图标显示在第几列
				idName: 'id',  // 自定义id字段的名称
				pidName: 'pid',  // 自定义标识是否还有子节点的字段名称
				haveChildName: 'haveChild',  // 自定义标识是否还有子节点的字段名称
				isPidData: true,  // 是否是pid形式数据
				arrowType: 'arrow2',   // 自定义箭头风格
				initLevel: 5,
				
				getIcon: function (d) {  // 自定义图标
					// d是当前行的数据
					if (d.haveChild) {  // 判断是否有子集
						return '<i class="ew-tree-icon ew-tree-icon-folder"></i>';
					} else {
						return '<i class="ew-tree-icon ew-tree-icon-file"></i>';
					}
				}
			},
			cols: [
				//{type: 'numbers'},
				//{field: 'pid', title: 'PID'},
				{ field: 'id', title: 'ID', width: 50 },
				{ field: 'name', title: '栏目名称', width: 260 },
				{ field: 'type', title: '类型', templet: '#catetypeTableBar' },
				{ field: 'sort', title: '排序',width: 40},
				{ field: 'theme', title: '模板', templet: '#themeTableBar' },
				{ field: 'num', title: '前台条数',width: 80},
				{ field: 'color', title: '统计颜色标识', templet: '#themeColor'},
				{ field: 'ct', title: '是否统计', templet: '#ctcount'},
				{ field: 'urlname', title: 'URL'},
				{ title: '操作', minWidth: 80, templet: '#currentTableBar', fixed: "right", align: "center" }
			],
		});

		$(".data-add-btn").on("click", function () {
			loadMain('<{caUrl("contentcate","add")}>&view&menuname=栏目添加');
			return false;
		});

		// 全部展开
		$('#btnExpandAll').click(function () {
			insTb.expandAll();
		});

		// 全部折叠
		$('#btnFoldAll').click(function () {
			insTb.foldAll();
		});


		treeTable.on('tool(currentTableId)', function (obj) {
			var data = obj.data;
			if (obj.event === 'edit') {
				loadMain('<{caUrl("contentcate","edit")}>&view&menuname=栏目编辑&id=' + data.id);
				return false;
			} else if (obj.event === 'delete') {
				layer.confirm('删除确认？', function (index) {
					$.post('<{caUrl("contentcate","del")}>', data, function (res) {
						if (res.status == 1) {
							layer.msg(res.info, { icon: 1, time: 1000 }, function () {
								obj.del();
								layer.close(index);
							});
						} else {
							layer.msg(res.info, { icon: 2, anim: 6, time: 5000 });
						}
					});
				});
			}
		});
	});

</script>